/**
 * 1. useState 不能自动合并属性，对象参数，修改其中一个，其他属性会被清空为undefined
 *    需要将老的属性，放在其中后，再修改需要修改的属性
 *
 */

const App = () => {
  const [user, setUser] = useState({ name: undefined, age: undefined });

  /**
   * 这里，需要...user， 拓展原有属性，防止属性丢失
   */
  const clickAdd = () => {
    useState({
      ...user,
      age: 20,
    });
  };

  return (
    <>
      当前用户:name:{user.name}, age:{user.age}
      <button onclick={clickAdd}>修改用户年龄</button>
    </>
  );
};


/**
 * 不能在原址上修改，因为原址上修改，引用地址没变，数据对比就是没变，不会去更新UI了。
 */

const onclick = () => {
  user.age = 20;// 直接修改user上的属性
  setUser(user);// 这里不会更新UI视图，因为user的age没被改变
}

